import { createStore } from 'vuex'
import {getMusicLyric} from '@/request/api/item'

/** 1.安装 vue保存数据到localStorage中 
 *   npm install vuex-persistedstate -s
*/
import createPersistedstate from 'vuex-persistedstate'


import mutations from './mutations'

import { getPhoneLoggin } from '@/request/api/home'
const state ={
  plaList:[{
      
    //播放列表
    al:{
      id: 19372,
      name: "首选",
      pic: 19106213556155070,
      picUrl: "https://p1.music.126.net/I2bCBoPUkRUf6jf3J8CHlg==/19106213556155071.jpg",
      pic_str: "19106213556155071",
    },
    id:112908,
    //获取歌单名字
    ar:[{
      name:"张栋梁"
    }]
  }],
  plaListIndex:0,//默认下标为0
  isbtnShow:true, //暂停按钮的显示
  detailShow:false,//歌曲详情页的显示
  lyricList:{}, //歌词
  currentTime:0,//记录歌曲播放的当前时间
  duration:0, //歌曲总时长
  isLogin:false, //判断是否登录
  isFooterMusic:true, //判断是否要显示底部组件
  token:"", //保存登录的状态
  user:{}, //用户信息 
}


export default createStore({
  state,
  getters:{},
  mutations,
  //异步请求在 actions操作
  actions:{
    getLyric:async function(context, value){
      let res = await getMusicLyric(value);
      //console.log(res)
      context.commit("updateLyricList",res.data.lrc)
    },
    //登录
    getLogin: async function(context, value){
      let res = await getPhoneLoggin(value);
      // console.log(res)
      //把结果返回出去
      return res;
    }
  },

  modules:{},


  /** 2.配置 保存持久化模块*/
  plugins:[
    
    // 插件配置 支持多个插件的
    createPersistedstate({
      storage: window.sessionStorage,

      key: 'message', // 这个key会作为标识存入本地
      paths: ['user'] // 哪个模块进行持久化缓存 内部所有的数据都会进行持久换缓存

    })
  ]
})
